<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <link rel="icon" href="https://github.com/fluidicon.png" type="image/png">
    <title>Home - Expro</title>
   
    <!-- Bootstrap core CSS-->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">

    <!-- Page level plugin CSS-->
    <link rel="stylesheet" href="http://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" >

    <!-- Custom styles for this template -->
    <link rel="stylesheet" href="css/dashboard.css" >
  </head>

  <body>
    <nav class="navbar navbar-dark fixed-top bg-dark flex-md-nowrap p-0 shadow">
        <a class="navbar-brand col-sm-3 col-md-2 mr-0" href="./index.html">Express Pro</a>        
        <ul class="navbar-nav px-3">
          <li class="nav-item text-nowrap">
            <a class="nav-link" href="./about.html">About</a>
          </li>
        </ul>
    </nav>    
    <div class="container-fluid">
        <div class="row">

          <!-- sidebar -->
          <nav class="col-md-2 d-none d-md-block bg-light sidebar">
            <div class="sidebar-sticky">
              <ul class="nav flex-column">
                <li class="nav-item">
                  <a class="nav-link active" href="./index.html"  >
                    <span data-feather="home"></span>
                    Express <span class="sr-only">(current)</span>
                  </a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" target="_blank" href="./air.html" >
                    <span data-feather="send"></span>
                    Air
                  </a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="./document.html">
                    <span data-feather="file"></span>
                    Document
                  </a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="./country.html">
                    <span data-feather="map"></span>
                    Country
                  </a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="./expressrate.html">
                    <span data-feather="bar-chart-2"></span>
                    Express Rate
                  </a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="./airrate.html">
                    <span data-feather="layers"></span>
                    Air Rate
                  </a>
                </li>
              </ul>
            </div>
          </nav>
    <!-- sidebar End -->
      
          <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">            
          <h4>Express</h4>
          <!-- table-responsive -->  

          <div class="table-responsive">
            <table class="table table-striped table-hover table-sm "  id="dataTable" width="100%" cellspacing="0" >
              <!-- js读取列表. --> 
            </table>
          </div>  
          <hr>

          <h6>从产品库中选择装箱，或<button id="btnexpressaddrow" >Add Row</button>加入自定义重量尺寸。</h6>

          <div class="table-responsive">
              <table class="table table-striped table-hover table-sm "  id="selecttable" >
              <!-- js读取列表. --> 
              </table>
          </div>  

          <div class="col-md-5 mb-3">
            <div class="input-group mb-3" name="divsearch" >
              <input type="text" class="form-control" id="inputSearch" placeholder="Search"  >
              <!-- 搜索文本框 -->
            </div>
          </div>

          <!-- 国家下拉菜单 -->
          <div class="col-md-5 mb-3">
            <div class="input-group mb-3">
              <select class="custom-select" id="countryselect">
                <option selected>Choose...</option>
                <option value="1">One</option>
                <option value="2">Two</option>
                <option value="3">Three</option>
              </select>
              <button class="btn btn-outline-primary"  data-toggle="modal" data-target="#zoneandrateModal" >Submit</button>
            </div>
          </div>

          <!-- Table End -->

      <!-- Sticky Footer -->
      <footer class="sticky-footer">
        <div class="container my-auto">
          <div class="copyright text-center my-auto">
              <span>Copyright © Expro - SIUI  2019</span>
          </div>
        </div>
      </footer>
    
    </main>
  </div>
</div>



  <!-- Scroll to Top Button-->
  <a class="scroll-to-top rounded" href="#page-top">UPUP
      <span data-feather="file-text"></span>
  </a>



   <!-- Modal-->
   <div class="modal fade" id="zoneandrateModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
      <div  id="modalDialog" class="modal-dialog" role="document">
          <div class="modal-content">
              <div class="modal-header">
                  <h5 class="modal-title capitalize" id="exampleModalLabel" >Ready to Leave?</h5>
                  <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                      <span aria-hidden="true">×</span>
                  </button>
              </div>
              <div class="modal-body">
            <!--
                  <div class="form-group row">

                      <label for="txtweight" class="col-sm-2 col-form-label col-form-label-sm">Weight</label>
                      <div class="col-sm-8">
                          <input type="text" class="form-control" id="txtweight" placeholder="" value="" required>                             
                      </div>
                  </div>
                  -->
                  <div class="table-responsive">
                      <table class="table table-striped table-sm table-hover display " id="expresstable">
                        <!-- 加入结果 -->
                      </table>
                  </div>
                  <h6 class="modal-title capitalize" id="countryremark" >Ready to Leave?</h6>
              </div>
              <div class="modal-footer">
                  <button class="btn btn-outline-primary" type="button" data-dismiss="modal">关闭</button>                      
              </div>
          </div>
      </div>
  </div>
  <!-- Modal END -->

  <!-- feather 图标 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/feather-icons/4.22.1/feather.js"></script>
<script>
    feather.replace()
</script>
<!-- Bootstrap core JavaScript-->
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.js"></script>
<script src="./script/jquery-ui.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
     
<!-- Page level plugin JavaScript-->        
<script src="http://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
      
<!-- 读取JSON文件 scripts for this page--> 

<script src="./json/json_product.js"></script> 
<script src="./json/json_countrysortbyname.js"></script>   
<script src="./json/json_country.js"></script>     
<script src="./json/json_currencyrate.js"></script>  
<script src="./json/json_freightFedexIEE.js"></script>
<script src="./json/json_freightFedexIPE.js"></script>  
<script src="./json/json_freightHkd.js"></script>  
<script src="./json/json_freightHkt.js"></script>  
<script src="./json/json_freightStd.js"></script>  
<script src="./json/json_freightUpsExpedited.js"></script>  
<script src="./json/json_freightUpsSaver.js"></script>  
<script src="./json/json_fuelSurcharge.js"></script>
           
  
<!-- Demo scripts for this page-->
<script src="./script/site.js"></script>

<script src="./script/express_gettable.js"></script>


<script src="./script/express_handledata.js"></script>

<script src="./script/getzonerate.js"></script>

<script>
    $(document).ready(function(){

        $("#modalDialog").draggable();//为模态对话框添加拖拽
        $("#zoneandrateModal").css("overflow", "hidden");//禁止模态对话框的半透明背景滚动

    })
</script>

</html>
